<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>

<body>
    <script type="text/javascript">
        /* 
            总结：
                1.类中的构造器不是必须写的，要对实例进行一些初始化的操作，如添加指定属性时才写。
                2.如果A类继承了B类，且A类中写了构造器，那么A类构造器中的super时必须调用的。
                3.类中所定义的方法，都是放在了类的原型对象上，供实例使用。
        */
        // 创建一个person类
        class Person {
            name = '';
            age = 0;
            constructor(name, age) {
                this.name = name;
                this.age = age;
            }
            // 一般方法
            speak() {
                // 放在哪里  -类的原型对象上 --供实例使用
                // 通过 Person实例调用 speak时，speak中的 this 就是Person 实例
                console.log(`我叫${this.name},年龄是${this.age}`);
            }
        }
        // let p1 = new Person('tom', 18)
        // let p2 = new Person('jerry', 19)
        // console.log('p1=', p1);
        // console.log('p2=', p2);
        // p1.speak();
        // p2.speak();


        // 继承
        // 创建 Student 类，继承于 Person类
        class Student extends Person {
            constructor(name, age, grade) {
                // 调用父类构造器
                super(name, age);
                this.grade = grade;
            }
            // 重写从父类继承的方法
            speak() {
                console.log(`我叫${this.name},年龄是${this.age},我读的是${this.grade}`);
            }
            study() {
                // 放在哪里  -类的原型对象上 --供实例使用
                // 通过 Study 实例调用 study时，study中的 this 就是Study 实例
                console.log('我很努力的学习');
            }
        }
        const s1 = new Student('小张', 15, '高一');
        console.log('s1==', s1);


        class Car {
            constructor(name, price) {
                this.name = name;
                this.price = price;
            }
            // 类中可以直接写赋值语句，如下代码的含义是：给 Car 的实例添加一个属性，名为 a 值为1
            a = 1;
            wheel = 4;
        }
        const c1 = new Car('奔驰c63', 199);
        const c2 = new Car('宝马', 299);
    </script>

</body>

</html>